
{% load i18n %}

{% block content %}
<!DOCTYPE html> 
<html> 
    <head> 
    <title>Course Page</title> 
    <link rel="stylesheet" href="/static/jquery.mobile-1.0a2/jquery.mobile-1.0a2.min.css" />
    <script src="/static/jquery.min.js"></script>
    <script src="/static/jquery.mobile-1.0a2/jquery.mobile-1.0a2.min.js"></script>
</head> 
<body>

<!-- Home Page -->
<div data-role="page" > 
    <div data-role="header">
<a href="/">back</a><h3>{{course.title}}</h3>
 <a href='/accounts/logout/' rel="external" > logout</a>
    </div> 
    <div data-role="content">

<div data-role="collapsible-set" >

<div data-role="collapsible" >
<h3> Teached by:</h3> <div style="background-color: #fef5be;


  border-top: 2px solid #fdd425;
  border-bottom: 2px solid #fdd425;
"> <p style="margin-left: 10px;margin-right: 10px;font-size:29px;
text-align:center;font-family:'Times New Roman', Times, serif;color:#333333;">{{course.teacher}}</p></div>
</div>
<div data-role="collapsible" >
<h3>Course Description:</h3><div style="background-color: #fef5be;


  border-top: 2px solid #fdd425;
  border-bottom: 2px solid #fdd425;
"> <p style="margin-left: 10px;margin-right: 10px;font-family:'Times New Roman', Times, serif;color:#333333;">{{course.info}}</p></div>
</div>
<div data-role="collapsible">
<h3>Lecture running now</h3>

<ul data-role="listview" data-inset="true">
<li><a style="white-space:normal" href="/courses/tweet/{{course.id}}" rel="external">Messaging board</li></a>
<li><a href="/quiz/take/{{course.id}}"> Take quiz</a></li>
</ul>
</div>
<div>
</div> 
</div> 
</body>
</html>

{% endblock %}
